<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>数据字典</title>
		<link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.4.4/themes/icon.css"/>
	    <link rel="stylesheet" type="text/css" href="js/jquery-easyui-1.4.4/themes/default/easyui.css"/>
	    <script type="text/javascript" src="js/jquery-easyui-1.4.4/jquery.min.js"></script>
	    <script type="text/javascript" src="js/jquery-easyui-1.4.4/jquery.easyui.min.js"></script>
	    <script type="text/javascript" src="js/jquery-easyui-1.4.4/locale/easyui-lang-zh_CN.js"></script>
    	<script type="text/javascript">
    		var selectedCate;
    		var Cate;
    		var dataCount;
    		var editedData;
    		var editedCate;
    		var selectedData;
    		var metaData;
    		var cateType;
    		var oldCate;
    		function windowwidth(percent){
    			var wholewidth = window.innerWidth;
    			var width = percent * wholewidth;
    			return width;
    		}
    		function windowheight(percent){
    			var wholeheight = window.innerHeight;
    			var height = percent * wholeheight;
    			return height;
    		}
    		function selectCate(index, data){
    			Cate = data.cateName;
    			var map = {cate: Cate};
    			$.ajax({
					type: "POST",
					async: false,
					url: 'meta!metaList.do',
					data: map,
					dataType: 'json',
					success: function(data){
						metaData = data;
						$("#datagrid").datagrid('loadData', metaData);
						editedData = null;
						dataCount = data.total;
					}
				});
    			selectedCate = index;
    			if(editedCate != null){
    				saveCate();
    			}
    		}
    		function addCate(){
    			if(editedCate == null){
    				cateType = 'add';
    				editedCate = $("#catelist").datagrid('getData').total;
    				$("#catelist").datagrid("appendRow", {})
					  .datagrid("beginEdit", editedCate);
    				if(selectedCate != null){
    					$("#catelsit").datagrid("unselectRow", selectedCate);
    				}
    			}
    		}
    		function saveCate(){
    			if(editedCate == null){
    				return null;
    			}
				var row = $("#catelist").datagrid('endEdit', editedCate).datagrid('getRows')[editedCate];
				editedCate = null;
				if(row.cateName != null && row.cateName != ''){
					if(cateType == 'add'){
						$.ajax({
	    					type: "POST",
	    					async: false,
	    					url: 'meta!addCate.do',
	    					data: {cate: row.cateName},
	    					dataType: 'json',
	    					success: function(data){
	    						if(data.success){
			   						$("#cateList").datagrid('loadData', data);
			   					}
	    						else{
	    							reloadData();
	    						}
		   						$.messager.show({msg: data.msg,timeout: 1000});
	    					}
	    				})
					}else if(cateType == 'edit'){
						$.ajax({
	    					type: "POST",
	    					async: false,
	    					url: 'meta!editCate.do',
	    					data: {cate: row.cateName, oldCate: oldCate},
	    					dataType: 'json',
	    					success: function(data){
	    						if(data.success){
			   						$("#cateList").datagrid('loadData', data);
			   					}
	    						else{
	    							reloadData();
	    						}
		   						$.messager.show({msg: data.msg,timeout: 1000});
	    					}
	    				})
					}
				}
    		}
    		function reloadCate(){
    			$.ajax({
					type: "POST",
					async: false,
					url: 'meta!cateList.do',
					dataType: 'json',
					success: function(data){
						$("#catelist").datagrid('loadData', data);
					}
				});
    		}
    		function deleteCate(){
    			if(selectedCate == null){
    				$.messager.show({
    					title: '错误', 
    					msg: '请先选择字典',
    					timeout: 2000
    				});
    			}else{
    				var row = $("#catelist").datagrid('getSelected');
    				$.ajax({
    					type: "POST",
    					async: false,
    					url: 'meta!deleteCate.do',
    					data: {cate: row.cateName},
    					dataType: 'json',
    					success: function(data){
    						if(data.success){
		   						$("#catelist").datagrid('loadData', data);
		   						reloadData();
		   						$.messager.show({msg: '删除成功',timeout: 1000});
		   					}
    						else{
    							reloadData();
		   						$.messager.show({msg: '删除失败',timeout: 1000});
    						}
    					}
    				})
    			}
    		}
    		function editCate(){
    			if(selectedCate == null){
    				$.messager.show({msg: '请先选择数据字典',timeout: 2000});
    			}
    			else{
    				cateType = 'edit';
    				editedCate = selectedCate;
    				oldCate = Cate;
    				$("#catelist").datagrid("beginEdit", editedCate);
    			}
    		}
    		function valiteData(row){
    			var success = true;
    			var numReg = new RegExp("^[0-9]*$");
    			var msg;
    			if(row.key === "" | row.key == null){
    				success = false;
    				msg = "数据名称不能为空！";
    			}else if(!numReg.test(row.value)| row.value === ""){
    				success = false;
    				msg = "数据取值必须为数字！";
    			}
    			if(!success){
					$.messager.show({msg: msg,timeout: 1000});
    			}
    			return success;
    		}
    		function selectData(index, data){
    			selectedData = index;
    			if(editedData != null){
    				saveData();
    			}
    		}
    		function saveData(){
    			if(editedData == null){
    				return null;
    			}
				var row = $("#datagrid").datagrid('endEdit', editedData).datagrid('getRows')[editedData];
				editedData = null;
				var dataID = (row.dataID == null)?0:row.dataID;
				if(valiteData(row)){
    				$.ajax({
    					type: "POST",
    					async: false,
    					url: 'meta!saveData.do',
    					data: {dataID: dataID, cate: Cate, key: row.key, value: row.value},
    					dataType: 'json',
    					success: function(data){
    						if(data.success){
		   						metaData = data;
		   						$("#datagrid").datagrid('loadData', metaData);
		   						dataCount = data.total;
		   						$.messager.show({msg: '保存成功',timeout: 1000});
		   					}
    						else{
    							reloadData();
    							if(data.msg == null){
		   							$.messager.show({msg: '保存失败',timeout: 1000});
    							}
    							else{
    								$.messager.show({msg: data.msg, timeout: 1000})
    							}
    						}
    					}
    				})
				}
				else{
					var map = {cate: Cate};
	    			$.ajax({
						type: "POST",
						async: false,
						url: 'meta!metaList.do',
						data: map,
						dataType: 'json',
						success: function(data){
							metaData = data;
							$("#datagrid").datagrid('loadData', metaData);
							dataCount = data.total;
						}
					});
				}
    		}
    		function reloadData(){
    			var map = {cate: Cate};
    			$.ajax({
					type: "POST",
					async: false,
					url: 'meta!metaList.do',
					data: map,
					dataType: 'json',
					success: function(data){
						metaData = data;
						$("#datagrid").datagrid('loadData', metaData);
						dataCount = data.total;
						editedData = null;
					}
				});
    		}
    		function addData(){ 
    			if(Cate == null){
    				$.messager.show({msg: '请先选择字典类别',timeout: 2000});
    			}
    			else if(editedData == null){
	    			editedData = dataCount;
	    			$("#datagrid").datagrid("appendRow", {});
	    			$("#datagrid").datagrid("beginEdit", editedData);
	    			if(selectedData != null){
		    			$("#datagrid").datagrid("unselectRow", selectedData);
		    			selectedData = null;
	    			}
    			}
    		}
    		function deleteData(){
    			if(Cate == null){
    				$.messager.show({
    					title: '错误', 
    					msg: '请先选择字典',
    					timeout: 2000
    				});
    			}else if(selectedData == null){
    				$.messager.show({
    					title: '错误', 
    					msg: '请先选择一项数据',
    					timeout: 2000
    				});
    			}else{
    				var row = $('#datagrid').datagrid('getSelected');
    				$.ajax({
    					type: "POST",
    					async: false,
    					url: 'meta!deleteData.do',
    					data: {dataID: row.dataID, cate: Cate},
    					dataType: 'json',
    					success: function(data){
    						metaData = data;
    						$("#datagrid").datagrid('loadData', metaData);
    						dataCount = data.total;
    						$.messager.show({msg: '删除成功',timeout: 1000});
    					}
    				})
    			}
    		}
    		function editData(){
    			if(Cate == null){
    				$.messager.show({msg: '请先选择字典类别',timeout: 2000});
    			}else if(selectedData == null){
    				$.messager.show({msg: '请先选择字典数据',timeout: 2000});
    			}else{
    				editedData = selectedData;
    				$("#datagrid").datagrid("beginEdit", editedData)
					  			  .datagrid("unselectRow", selectedData);
    				selectedData = null;
    			}
    		}
    		$(function(){
    			$("#west").panel({
    				width: windowwidth(0.2),
    				height: windowheight(0.98),
    				title: "字典列表",
    				style: {
    					float: 'left',
    					margin: 0
    				},
    				tools: [{
    				    iconCls:'icon-add',
    				    handler: addCate
    				  },{
    				    iconCls:'icon-remove',
    				    handler: deleteCate
    				  },{
    				    iconCls:'icon-edit',
    				    handler: editCate
    				  },{
    				    iconCls:'icon-reload',
    				    handler: reloadCate
    				  },{
    				    iconCls:'icon-save',
    				    handler: saveCate
    				  }]
    			});
    			$("#east").panel({
    				width: windowwidth(0.79),
    				height: windowheight(0.98),
    				title: '字典数据',
    				style: {
    					float: 'left',
    					margin: '0 -50px 0 0'
    				} ,
    				tools: [{
    				    iconCls: 'icon-add',
    				    handler: addData
    				  },{
    				    iconCls: 'icon-remove',
    				    handler: deleteData
    				  },{
    				    iconCls:'icon-edit',
    				    handler: editData
    				  },{
    				    iconCls:'icon-reload',
    				    handler: reloadData
    				  },{
    				    iconCls:'icon-save',
    				    handler: saveData
    				  }]
    			})
    			$("#catelist").datagrid({
    				singleSelect: true,
        			url:'meta!cateList.do',
        			border: false,
        			fit: true,
    				columns: [[{
    					field:'cateName',
    					title:'字典类别',
    					width: windowwidth(0.198),
    					align:'center',
    					fit: true,
    					editor:'text'
    				}]],
    				onSelect: selectCate
        		});
    			$("#datagrid").datagrid({
    				singleSelect: true,
    				fit: true,
    				border: false,
    				columns: [[{
    					field:'key',
    					title:'数据名称',
    					width: windowwidth(0.3),
    					align:'center',
    					fit: true,
    					editor:'text'
    				},{
    					field:'value',
    					title:'数据取值',
    					width: windowwidth(0.3),
    					align:'center',
    					fit: true,
    					editor:'text'
    				}]],
    				onSelect: selectData
    			})
    		}) 
    	</script>
    </head>
	<body>
		<div id="content">
			<div id="west">
				<table id="catelist"></table>
			</div>
			<div id="east">
				<table id="datagrid"></table>
			</div>
		</div>
	</body>
</html>